import { createRouter, createWebHashHistory } from 'vue-router'

/**
 * 自动化导入依赖文件
 * PS：glob是动态引入，构建时，会分离为独立的 chunk，globEager是静态引入
 * [官方描述](https://cn.vitejs.dev/guide/features.html#glob-import)
 */
const modules = import.meta.globEager('./modules/*.js')
const routes = Object.values(modules).map((v) => v.default)

/**
 * 此处选择hash模式 => #
 * [官方模式描述](https://next.router.vuejs.org/zh/guide/essentials/history-mode.html)
 */
const router = createRouter({
	history: createWebHashHistory(),
	routes: routes.flat(Infinity),
})

/**
 * 路由触发时的全局前置守卫
 * PS：路由触发时就被正常调用
 * [官方路由描述](https://next.router.vuejs.org/zh/guide/advanced/navigation-guards.html#%E5%85%A8%E5%B1%80%E5%89%8D%E7%BD%AE%E5%AE%88%E5%8D%AB)
 */
router.beforeEach((to, from, next) => {
	if (to.name === 'Login') {
		// 进行拦截，例如没有登录权限只能访问Login
		next({ name: 'Login' })
	} else {
		next()
	}
})

/**
 * 路由触发时的全局解析守卫
 * PS：路由触发时并且同时在所有组件内守卫和异步路由组件被解析之后，解析守卫就被正确调用
 * [官方案例描述](https://next.router.vuejs.org/zh/guide/advanced/navigation-guards.html#%E5%85%A8%E5%B1%80%E8%A7%A3%E6%9E%90%E5%AE%88%E5%8D%AB)
 */
router.beforeResolve(async (to) => {
	// 获取数据或执行任何其他操作的理想位置
})

/**
 * 路由触发后的全局后置钩子
 * PS：一般用于分析、更改页面标题、声明页面等辅助功能等等场景
 */
router.afterEach((to, from, failure) => {
	document.title = to.meta.title
})

export default router
